
<img class="{className} {domRandomClass}" src={getUrl} alt="">
<style>
    .img_content{
        position: relative;
    }
    .img_loading{
        display: flex;
        align-items: center;
        justify-content: center;
    }
</style>
<script>
    import { onMount } from "svelte";
    import SkFoldingCube from './SkFoldingCube.svelte'
    export let url = ""
    let domRandomClass=`img_${parseInt(Math.random()*100000000)}`
    let iObserver=null;
    export let className = "";
    let getUrl=" "
    onMount(()=>{
        iObserver = new IntersectionObserver(function(entries) {
            if (entries[0].intersectionRatio <= 0) {
            }else{
                iObserver.disconnect()
                getUrl=url;
            }
        });
        iObserver.observe(document.querySelector(`.${domRandomClass}`));
    })
</script>